<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<jsp:include page="../common/bootstrap_knockout.jsp"></jsp:include>
<title>button exercise</title>
</head>
<body>
 <br>
 <!-- 按钮基本属性 -->
 <button type="button" class="btn">基础样式</button>
 <button type="button" class="btn btn-default">默认按钮</button>
 <button type="button" class="btn btn-primary">原始按钮</button>
 <button type="button" class="btn btn-success">成功按钮</button>
 <button type="button" class="btn btn-info">信息按钮</button>
 <button type="button" class="btn btn-warning">警告按钮</button>
 <button type="button" class="btn btn-danger">危险按钮</button>
 <button type="button" class="btn btn-link">链接按钮</button>

 <br>
 <br>
 <!-- 按钮基本属性 和大小属性 -->
 <p>
   <button type="button" class="btn btn-primary btn-lg">大的原始按钮</button>
   <button type="button" class="btn btn-default btn-lg">大的按钮</button>
 </p>
 <p>
   <button type="button" class="btn btn-primary">默认大小的原始按钮</button>
   <button type="button" class="btn btn-default">默认大小的按钮</button>
 </p>
 <p>
   <button type="button" class="btn btn-primary btn-sm">小的原始按钮</button>
   <button type="button" class="btn btn-default btn-sm">小的按钮</button>
 </p>

 <p>
   <button type="button" class="btn btn-primary btn-xm">特别小的原始按钮</button>
   <button type="button" class="btn btn-default btn-xm">特别小的按钮</button>
 </p>
 <p>
   <button type="button" class="btn btn-primary btn-block">块级的原始按钮</button>
   <button type="button" class="btn btn-default btn-block">块级的按钮</button>
 </p>

 <br>
 <br>
 <!-- 按钮基本属性 和状态属性 -->
 <p>
   <button type="button" class="btn btn-default btn-lg">默认按钮</button>
   <button type="button" class="btn btn-default btn-lg active">激活的默认按钮</button>
 </p>
 <p>
   <button type="button" class="btn btn-primary btn-lg">原始按钮</button>
   <button type="button" class="btn btn-primary btn-lg active">激活的原始按钮</button>
 </p>

 <br>
 <br>
 <!-- 按钮、a标签的基本属性 和状态属性 -->
 <p>
   <button type="button" class="btn btn-default btn-lg">默认按钮</button>
   <button type="button" class="btn btn-default btn-lg" disabled="disabled">禁用的默认按钮</button>
 </p>
 <p>
   <button type="button" class="btn btn-primary btn-lg">原始按钮</button>
   <button type="button" class="btn btn-primary btn-lg" disabled="disabled">禁用的原始按钮</button>
 </p>
  <p>
   <a role="button" class="btn btn-default btn-lg" href="#">链接</a>
   <a role="button" class="btn btn-default btn-lg disabled" href="#">禁用的链接</a>
 </p>
 <p>
   <a role="button" class="btn btn-primary btn-lg" href="#">原始链接</a>
   <a role="button" class="btn btn-primary btn-lg disabled" href="#">禁用的原始链接</a>
 </p>

 <br>
 <br>
 <!-- 按钮、a标签、input -->
 <a role="button" class="btn btn-default" href="#">链接</a>
 <button type="button" class="btn btn-default">按钮</button>
 <input type="button" class="btn btn-default" value="输入">
 <input type="submit" class="btn btn-default" value="提交">

</body>
</html>